<!DOCTYPE html>
<html>	
    <head>
        <title>My Drawing Game!</title>
        
        <!-- Include Javascript -->
        <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
	<script type="text/javascript" src="js/drawingCanvas.js"></script>
	<script type="text/javascript" src="resources/jquery.tzineClock/jquery.tzineClock.js"></script>
	<script type="text/javascript" src="js/main.js"></script>
        
        <!-- Include CSS -->
        <link rel="stylesheet" type="text/css" href="css/drawingGame.css" />
	<link rel="stylesheet" type="text/css" href="resources/jquery.tzineClock/jquery.tzineClock.css" />
	
    </head>

    <body>
        
	<!-- Main Drawing Game Container -->
        <div id="DrawingBody">
            
            <!-- Header Row -->
            <div id="DrawingHeader">
		<h2 align="center">The Drawing Game!</h2>
            </div>
            <!-- End Header Row -->

            <!-- Main Game Area -->
            <div id="GameArea">
                
                <!-- The Left Column where we display the actual game and take input from the user -->
		<div id = "LeftColumn" >
                    
                    <!-- Story Area for the user to type -->
                    <div id="StoryBox">
                        <textarea id="storyTextArea" rows="5" wrap="virtual" name="comments" >There once was a man named Anarlog...</textarea>
                    </div>
                    <!-- End Story Area -->
                    
                    <!-- Drawing Area for the user to draw -->
                    <div id ="DrawingBox">
                        <canvas id="drawingCanvas"></canvas>   
                    </div>
                    <!-- End Drawing Area -->
                    
                    <br />
		    
		    <!-- Finished Drawing or Typing Button -->
		    <button id="finishedButton">I'm Done</button>
                    
		</div>
                <!-- End Left Column -->
	
		<!-- Right Information Column -->
		<div id = "RightColumn">
		    
		    <!-- Right Column - Top -->
		    <div id = "RightTopBox">
			
			<!-- Countdown Clock -->
			<div id="CountdownClock"></div>
			
		    </div>
		    <!-- End Right Column Top -->
		    
		    <!-- Right Column - Bottom -->
		    <div id = "RightBottomBox">
		    </div>
		    <!-- End Right Column Bottom -->
		    
		</div>
		<!-- End Right Information Column -->
		
            </div>
            <!-- End GameArea Div -->
                
        </div>
	<!-- End Main Drawing Game Contianer -->
        
        
        
        
        <script type="text/javascript" src="js/Harmony/brushes/circles.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/chrome.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/fur.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/grid.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/longfur.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/ribbon.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/shaded.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/simple.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/sketchy.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/squares.js"></script>
        <script type="text/javascript" src="js/Harmony/brushes/web.js"></script>
        <script type="text/javascript" src="js/Harmony/colorutils.js"></script>
        <script type="text/javascript" src="js/Harmony/colorselector.js"></script>
        <script type="text/javascript" src="js/Harmony/palette.js"></script>
        <script type="text/javascript" src="js/Harmony/menu.js"></script>
        <script type="text/javascript" src="js/Harmony/about.js"></script>	
        <script type="text/javascript" src="js/Harmony/main.js"></script>
        
    </body>
    
</html>